<template>
  <div>
    <div class="body-box" v-if="cation_state == 0  && type == 1">
        <alert-box content="您的跑团未认证或认证已过期只能发布免费的活动和任务"></alert-box>
    </div>
    <div v-else>
      <div class="body-box">
        <window-title title="基本信息"></window-title>
        <div class="info-box">
          <base-info @change="changeBase" :active_id="0" :type="type" :is_edit="is_edit"></base-info>
        </div>
      </div>
      <div class="body-box">
        <window-title :title="type == 1 ? '组别信息' : '报名信息'"></window-title>
        <div class="info-box">
          <team-info @change="changeTeam" :active_id="0" :is_edit="is_edit" :type="type" :base="base"></team-info>
        </div>
      </div>
      <div class="body-box" v-if="type != 3 && cation_state > 0">
        <window-title title="附加服务"></window-title>
        <div class="info-box">
          <service-info @change="changeService" :active_id="0" :is_edit="is_edit"></service-info>
        </div>
      </div>
      <div class="body-box">
        <window-title title="详情信息"></window-title>
        <div class="info-box">
          <detail-info @change="changeDetail" :active_id="0" :is_edit="is_edit"></detail-info>
        </div>
      </div>
      <div class="body-box add-active-set-box">
        <el-button size="small" icon="el-icon-view" type="danger" @click="seeView()">预览</el-button>
        <el-button size="small" icon="el-icon-view" type="warning" @click="submit(1)">保存草稿箱</el-button>
        <el-button size="small" icon="el-icon-view" class="com-btn" @click="submit(2)">保存并发布</el-button>
      </div>
    </div>
    
    <!-- 模态框显示预览 -->
    <el-dialog :visible.sync="see_view" width="420px" title="活动预览" :destroy-on-close="true">
      <see-view :base="base" :detail="detail"></see-view>
    </el-dialog>
  </div>
</template>

<script>
import windowTitle from "../../components/unit/title.vue";
import baseInfo from "./set/base.vue";
import teamInfo from "./set/team.vue";
import detailInfo from "./set/detail.vue";
import seeView from "./set/view.vue";
import serviceInfo from "./set/service.vue";
import setForm from "./set/team/add-form.vue";
import alertBox from '../../components/unit/alert-box.vue';

export default {
  components: {
    windowTitle,
    baseInfo,
    teamInfo,
    detailInfo,
    seeView,
    serviceInfo,
    setForm,
    alertBox
  },
  data() {
    return {
      base: {},
      team: [],
      detail: "",
      service: {},
      see_view: false,
      type: this.$route.params.type,
      is_edit: true,
      cation_state: -1
    };
  },
  mounted() {
    setTimeout(() => {
      document.body.scrollTop = 0;
      document.documentElement.scrollTop = 0;
    }, 1000);
    this.getCation();
  },
  methods: {
    //获取认证信息
    getCation() {
      this.ajaxs("finance/getCationInfo", {
        success: res => {
          var cation_type = res.msg.cation_type;
          this.cation = res.msg;
          this.cation_state = cation_type;
          if (!res.code){
             this.cation_state = 0;
             cation_type = 0;
          }
          window.localStorage.setItem('cation',cation_type)
        }
      });
    },
    /**
     * 基本信息改变
     */
    changeBase(e) {
      this.base = e;
    },
    /**
     * 组别信息改变
     */
    changeTeam(e) {
      this.team = e;
    },
    /**
     * 详情信息改变
     */
    changeDetail(e) {
      this.detail = e;
    },
    /**
     * 附加服务改变
     */
    changeService(e) {
      this.service = e;
    },
    /**
     * 预览
     */
    seeView() {
      //判断基本数据是否合法
      if (!this.base.name) return this.toast(0, "请输入活动名称");
      if (!this.base.cover) return this.toast(0, "请上传活动封面图片");
      if (!this.base.active_time) return this.toast(0, "请选择活动时间");
      if (!this.base.address) return this.toast(0, "请选择活动地址");
      if (!this.base.active_type) return this.toast(0, "请选择比赛类型");
      if (this.base.enter == 2 && !this.base.enter_time)
        return this.toast(0, "请选择报名时间");
      //判断组别信息是否完整
      if (this.team.length == 0) return this.toast(0, "请添加组别");
      //判断服务信息
      for (var i in this.service) {
        if (this.service[i].name == "") return this.toast(0, "请输入服务名称");
        if (this.service[i].price == "") return this.toast(0, "请输入服务价格");
        if (this.service[i].num == "") return this.toast(0, "请输入服务数量");
        if (this.service[i].memo == "") return this.toast(0, "请输入服务描述");
        if (this.service[i].detail == "")
          return this.toast(0, "请输入服务详情");
      }
      //判断详情信息
      if (!this.detail) return this.toast(0, "请输入详情信息");
      //设置数据
      this.base.type = this.type;
      this.base.detail = this.detail;
      this.see_view = true;
    },
    /**
     * 保存并发布
     */
    submit(param) {
      //判断基本数据是否合法
      if (!this.base.name) return this.toast(0, "请输入活动名称");
      if (!this.base.cover) return this.toast(0, "请上传活动封面图片");
      if (!this.base.active_time) return this.toast(0, "请选择活动时间");
      if (!this.base.address) return this.toast(0, "请选择活动地址");
      if (!this.base.active_type) return this.toast(0, "请选择比赛类型");
      if (this.base.enter == 2 && !this.base.enter_time)
        return this.toast(0, "请选择报名时间");
      //判断组别信息是否完整
      if (this.team.length == 0) return this.toast(0, "请添加组别");
      for(var i in this.team) {
        if(this.team[i].name == '')return this.toast(0, "请输入组别名称");
        if(this.team[i].total_people == '')return this.toast(0, "总人数不能为空");
        if(this.team[i].is_pay){
          if(this.team[i].normal_price == '')return this.toast(0, "标准价不能为空");
          if(this.team[i].vip_price == '')return this.toast(0, "高级会员不能为空");
        }
        if(this.team[i].is_shift){
          if(this.team[i].shift_price == '')return this.toast(0, "早鸟价不能为空");
          if(this.team[i].shift_time == '')return this.toast(0, "早鸟时间不能为空");
        }
      }
      //判断服务信息
      for (var i in this.service) {
        if (this.service[i].name == "") return this.toast(0, "请输入服务名称");
        if (this.service[i].price == "") return this.toast(0, "请输入服务价格");
        if (this.service[i].num == "") return this.toast(0, "请输入服务数量");
        if (this.service[i].memo == "") return this.toast(0, "请输入服务描述");
        if (this.service[i].detail == "")
          return this.toast(0, "请输入服务详情");
      }
      //判断详情信息
      if (!this.detail) return this.toast(0, "请输入详情信息");
      //设置数据
      this.base.type = this.type;
      this.base.detail = this.detail;
      this.base.state = param;
      this.ajaxs("active/addActive", {
        data: { base: this.base, team: this.team, service: this.service },
        success: res => {
          this.toast(res.code, res.msg);
          if (res.code) {
            var path =
              param == 1 ? "/manage/active/drafts" : "/manage/active/list";
            setTimeout(() => {
              this.$router.push({
                path: path
              });
            }, 1000);
          }
        }
      });
    }
  },
  watch: {
    $route(v, o) {
      this.type = v.params.type;
    }
  }
};
</script>

<style>
.info-box {
  margin-top: 20px;
}
.add-active-set-box {
  text-align: center;
}
</style>